let requestUrl;

function addHandler() {
	requestUrl = "/role_category/insert";

	$("#modeling_dialog").dialog("open");
}

function editHandler() {
	let data = $("#category_list").datagrid("getSelected");

	if (data) {
		requestUrl = "/role_category/updateById";

		$("#id").val(data.id);
		$("#name").textbox("setValue", data.name);
		$("#note").textbox("setValue", data.note);
		$("#phyle").combobox("setValue", data.phyle);
		$("#gender").combobox("setValue", data.gender);
		$("#equipmentId").combobox("setValue", data.equipmentId);

		$("#modeling_dialog").dialog("open");
	} else {
		alertMsg("请选择要修改的记录。", "warning")
	}
}

function imageHandler() {
	let data = $("#category_list").datagrid("getSelected");

	if (data) {
		$("#category_id").val(data.id);
		$("#img").attr("src", data.image);

		$("#upload_dialog").dialog("open");
	} else {
		alertMsg("请选择要修改的记录。", "warning")
	}
}

$(document).ready(function() {

	$("#_phyle_").combobox({
		url: "/phyle/selectAll",
		valueField: "id",
		textField: "name",
		width: 150,
		panelHeight: "auto",
		prompt: "-选择种族-"
	});

	$("#sex").combobox({
		url: "/gender/selectAll",
		valueField: "id",
		textField: "name",
		width: 150,
		prompt: "-选择性别-",
		panelHeight: "auto",
		formatter: function(row) {
			return "<img width='20' src='" + row.image + "'/>&nbsp;" + row.name;
		}
	});

	$("#search").linkbutton({
		text: "搜索",
		iconCls: "icon-search"
	}).click(function() {
		let gender = $("#sex").combobox("getValue");
		let phyle = $("#_phyle_").combobox("getValue");

		$("#category_list").datagrid("reload", {
			gender: gender,
			phyle: phyle
		});
	});

	$("#clear").linkbutton({
		text: "清空",
		iconCls: "icon-delete"
	}).click(function() {
		$("#search_form").form("clear");
	});

	/******************************************************************************************************/

	$("#name").textbox({
		width: 120,
		required: true
	});
	
	$("#phyle").combobox({
		url: "/phyle/selectAll",
		valueField: "id",
		textField: "name",
		width: 120,
		required: true,
		panelHeight: "auto"
	});

	$("#gender").combobox({
		url: "/gender/selectAll",
		valueField: "id",
		textField: "name",
		width: 120,
		required: true,
		panelHeight: "auto",
		formatter: function(row) {
			return "<img width='20' src='" + row.image + "'/>&nbsp;" + row.name;
		}
	});

	$("#equipmentId").combobox({
		url: "/equipment_type/selectWeaponry",
		width: 120,
		valueField: "id",
		textField: "name",
		required: true,
		panelHeight: "auto"
	});
	
	$("#note").textbox({
		width: 320,
    	height: 100,
    	required: true,
		multiline: true
	});

	$("#modeling_dialog").dialog({
		title: "角色造型",
		width: 440,
		buttons: [{
			iconCls: "icon-save",
			text: "保存",
			handler: function() {
				let selector = "#modeling_form";

				checkForm(selector, function () {
					let data = $(selector).serialize();

					ajaxPost(requestUrl, data, function(resp) {
						showMsg(resp.message);

						$(selector).form("clear");
						$("#modeling_dialog").dialog("close");
						$("#category_list").datagrid("reload");
					}, error);
				});
			}
		}, {
			iconCls: "icon-cancel",
			text: "取消",
			handler: function() {
				$("#modeling_dialog").dialog("close");
				$("#modeling_form").form("clear");
			}
		}]
	});

	/******************************************************************************************************/

	fetchUploadFilebox("#category_list", "/role_category/upload");

	fetchUploadDialog("/role_category/updateImageById", function () {
		$("#category_list").datagrid("reload");
	});

	/******************************************************************************************************/

	/**
	 * 兵器类型列表
	 */
	$("#bingqi_list").datagrid({
		url: "/equipment_category/selectList",
		method: "get",
		width: 800,
		height: 450,
		fitColumns: true,
		columns: [[
			{field: "name", title: "名称", align: "center", width: 100},
			{field: "image", title: "图片", align: "center", width: 100
				, formatter: function(value) {
					return "<img src='" + value + "' width='32' />";
				}
			},
			{field: "grade", title: "等级", align: "center", width: 100
				, formatter: function(value) {
					return "<span>" + value + "<span />级";
				}
			},
			{field: "note", title: "说明", align: "center", width: 500
				, formatter: function(value) {
					return "<div class='ell' title='" + value + "'>" + value + "</div>";
				}
			}
		]]
	});

	/**
	 * 兵器详情对话框
	 */
	$("#bingqi_detail").dialog({
		title: "兵器详情"
	});

	/******************************************************************************************************/

	/**
	 * 表格体的高度
	 * @type {number}
	 */
	let heigt_body = heigt_tr_with_image * 10;
	/**
	 * 表格高度
	 * @type {number}
	 */
	let height_table = heigt_tool + heigt_header + heigt_body + heigt_footer + heigt_scoll_bar + 2;

	$("#category_list").datagrid({
		url: "/role_category/selectByPage",
		height: height_table,
		rownumbers: true,
		pagination: true,
		toolbar: [{
			iconCls: "icon-add",
			text: "添加",
			handler: function() {
				addHandler();
			}
		}, "-", {
			iconCls: "icon-edit",
			text: "修改",
			handler: function() {
				editHandler();
			}
		}, "-", imageUpdateButton],
		frozenColumns: [[
			{field: "id", title: "编号", align: "center", hidden: true},
			{field: "name", title: "角色名称", align: "center", width: 120}
		]],
		columns: [[
			{field: "image", title: "图片", align: "center", width: 120
				, formatter: function(value) {
					return "<img height='" + size + "' src='" + value + "' />";
				}
			},
			{field: "gender", title: "性别", align: "center", width: 120
				, formatter: function(value, rowData, rowIndex) {
					ajaxGet("/gender/selectById", {
						id: value
					}, function(resp) {
						let data = resp.data;

						$("#gender_" + rowIndex).attr({
							src: data.image,
							alt: data.name,
							title: data.name
						});
					}, error);

					return "<img height='20' id='gender_" + rowIndex + "' />";
				}
			},
			{field: "phyle", title: "种族", align: "center", width: 120
				, formatter: function(value, rowData, rowIndex) {
					ajaxGet("/phyle/selectById", {
						id: value
					}, function(resp) {
						let data = resp.data;

						$("#phyle_" + rowIndex).html(data.name);
					}, error);

					return "<div id='phyle_" + rowIndex + "'></div>";
				}
			},
			{field: "note", title: "角色介绍", align: "center", width: 750
				, formatter: function(value) {
					return "<div class='ell' title='" + value + "'>" + value + "</div>";
				}
			},
			{field: "equipmentId", title: "擅使兵器", align: "center", width: 120
				, formatter: function(value, rowData, rowIndex) {
					ajaxGet("/equipment_type/selectById", {
						id: value
					}, function(resp) {
						let name = resp.data.name;

						$("#bingqi_" + rowIndex).click(function() {
							$("#bingqi_list").datagrid("reload", {
								type: value
							});
							
							$("#bingqi_detail").dialog({
								title: "兵器·" + name
							}).dialog("open");
						}).html(name);
					}, error);
					
					return "<div class='blue' id='bingqi_" + rowIndex + "'></div>";
				}
			}
		]]
	});

});